<!DOCTYPE html>
<html>
<head>

	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="">
	<meta name="author" content="">

	<title>SB Admin - Bootstrap Admin Template</title>

	<!-- Bootstrap Core CSS -->
	<link href="__PUBLIC__/home/css/bootstrap.min.css" rel="stylesheet">

	<!-- Custom Fonts -->
	<!--<link href="_PUBLIC__/font/css/font-awesome.min.css" rel="stylesheet" type="text/css">-->

	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->

</head>
<body>
<!--<div class="container-fluid">-->
<!-- Page Heading -->
<div class="row">
	<div class="col-md-12">
		<ol class="breadcrumb">
			<li class="active">
				<i class="fa fa-fw fa-edit"></i>
				添加用户和店铺
			</li>
		</ol>
	</div>
</div>
<div class="row">
	<ul class="nav nav-tabs" role="tablist">
		<li role="presentation" class="active"><a href="#message" aria-controls="home" role="tab" data-toggle="tab">基本信息</a></li>
	</ul>
	<div class="tab-content col-xs-12">
		<div role="tabpanel" class="tab-pane active" id="message">
			<div class="row">
				<div class="col-sm-10">
					<form id="zyn-form-add" class="form-horizontal" action="{:U('Store/revise')}" method="post">
						<input name="store_id" value="{$store.store_id}" style="display: none;">
						<div class="form-group">
							<label for="lc-input-user_name" class="control-label col-sm-2">用户名</label>
							<div class="col-sm-3">
								<input id="lc-input-user_name" class="form-control" type="text" name="user_name" value="{$store.user_name}"/>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "device_name">*商家登陆账号</p>
							</div>
						</div>
						<div class="form-group">
							<label for="lc-input-phone_mob" class="control-label col-sm-2">手机号</label>
							<div class="col-sm-3">
								<input id="lc-input-phone_mob" class="form-control" type="text" name="phone_mob" value="{$store.phone_mob}"/>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "phone_mob">*手机号</p>
							</div>
						</div>
						<div class="form-group">
							<label for="lc-input-email" class="control-label col-sm-2">邮箱</label>
							<div class="col-sm-3">
								<input id="lc-input-email" class="form-control" type="text" name="email" value="{$store.email}"/>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "email">*邮箱</p>
							</div>
						</div>
						<div class="form-group">
							<label for="lc-input-store_name" class="control-label col-sm-2">店家名称</label>
							<div class="col-sm-3">
								<input id="lc-input-store_name" class="form-control" type="text" name="store_name" value="{$store.store_name}"/>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "store_name">*请填写店铺名</p>
							</div>
						</div>
						<div class="form-group " id="lc-div-input">
							<label for="lc-input-region_name" class="control-label col-sm-2">地区</label>
							<div class="col-sm-3 form-inline">
								<input id="lc-input-region_name1" class="form-control" type="text" name="region_name1" value="{$store.region_name}" style="width: auto" disabled="ture"/>
								<input id="lc-input-region_name" class="form-control" type="text" name="region_name" value="{$store.region_name}" style="width: auto; display:none"/>

								<button class="btn btn-primary revise-region" type="button">选择地区</button>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "device_name">*地区</p>
							</div>
						</div>
						<div class="form-group" id="lc-div-select" style="display: none">
							<label for="lc-select1-region" class="control-label col-sm-2">地区</label>
							<div class="col-sm-3 form-inline" >
								<select class="p-no-margin form-control" value="0" id="lc-select1-region" style="width: auto;">
									<option value="0">请选择</option>
									<volist name="region1" id="re">
										<option value="{$re.region_id}">{$re.region_name}</option>
									</volist>
								</select>
								<select class="p-no-margin form-control" value="0" id="lc-select2-region" style="display: none; width: auto;">
									<option value="0">请选择</option>
								</select>
								<select class="p-no-margin form-control" value="0" id="lc-select3-region" name="region_id" style="display: none; width: auto;">
									<option value="0">请选择</option>
								</select>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-command p-no-margin" attr-validate = "lc-select1-region">*选择地区</p>
							</div>
						</div>
						<div class="form-group">
							<label for="lc-input-address" class="control-label col-sm-2">地址</label>
							<div class="col-sm-3">
								<input id="lc-input-address" class="form-control" type="text" name="address" value="{$store.address}"/>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-result p-no-margin" attr-validate = "address">*详细地址</p>
							</div>
						</div>
						<div class="form-group">
							<label for="lc-select-state" class="control-label col-sm-2">状态</label>
							<div class="col-sm-3">
								<select class="p-no-margin form-control" value="0" id="lc-select-state" name="state">
									<option value="0" <if condition="$store.state eq 0">selected</if>>未选择</option>
									<option value="1" <if condition="$store.state eq 1">selected</if>>启用</option>
									<option value="2" <if condition="$store.state eq 2">selected</if>>关闭</option>
								</select>
							</div>
							<div class="col-sm-3">
								<p class="lc-p-validate-command p-no-margin" attr-validate = "lc-select-state">*是否启用该店铺</p>
							</div>
						</div>
						<div class="col-xs-10 col-xs-offset-2">
							<button class="btn btn-primary" id="lc-btn-save" type="submit">提交保存</button>
							<button class="btn btn-primary" id="lc-btn-return">返回上一页</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>

</body>
<script src="__PUBLIC__/home/js/jquery.min.js"></script>
<script src="__PUBLIC__/home/js/bootstrap.min.js"></script>
<script src=""></script>
<script>
    var region = '';
    $("#lc-select1-region").on('change',function () {
        if($(this).val()){
            $.ajax({
                type:"post",
                url:"{:U('Store/getRegion')}",
                async:true,
                data:{'parent_id':$(this).val()},
                dataType:"json",
                success:function(result) {
                    if (result.code == 10000) {
                        var shtml = '';
                        for(var i in result.data){
                            shtml += '<option value="'+result.data[i].region_id+'">'+result.data[i].region_name+'</option>'
                        }
                        var start = '<option value="0" selected>请选择</option>'
                        $("#lc-select2-region").html(start+shtml)
                        $("#lc-select2-region").css('display','');
                        $("#lc-select3-region").css('display','none');
                        change_region();
                    }
                }
            });
        }
    })
    $("#lc-select2-region").on('change',function () {
        if($(this).val()){
            $.ajax({
                type:"post",
                url:"{:U('Store/getRegion')}",
                async:true,
                data:{'parent_id':$(this).val()},
                dataType:"json",
                success:function(result) {
                    if (result.code == 10000) {
                        var shtml = '';
                        for(var i in result.data){
                            shtml += '<option value="'+result.data[i].region_id+'">'+result.data[i].region_name+'</option>'
                        }
                        var start = '<option value="0" selected>请选择</option>'
                        $("#lc-select3-region").html(start+shtml)
                        $("#lc-select3-region").css('display','');
                        change_region();
                    }
                }
            });
        }
    })
    $("#lc-select3-region").on('change',function () {
        change_region();
    });
    function change_region() {
        region = ''
        console.log($("#lc-select3-region").val())
        if($("#lc-select1-region").val() != 0){
            region += $("#lc-select1-region option:selected").text() + ' ';
        }
        if($("#lc-select2-region").val() != 0){
            region += $("#lc-select2-region option:selected").text() + ' ';
        }
        if($("#lc-select3-region").val() != 0){
            region += $("#lc-select3-region option:selected").text() + ' ';
        }
        $("#lc-input-region_name").val(region);
        console.log($("#lc-input-region_name").val())
    }
    $("#lc-btn-return").click(function () {
        location.href = "{:U('Store/index')}";
    })
	$("button.revise-region").click(function () {
		$("#lc-div-input").css('display','none');
        $("#lc-div-select").css('display','');
        $("#lc-input-region_name").removeAttr('disabled');
    })
</script>
</html>
